import * as React from 'react'
import { inject, observer } from 'mobx-react'
import { Route, Switch, Redirect, withRouter, Link } from 'react-router-dom'
import DevTools from 'mobx-react-devtools'

import routes from './routes'
import NotFound from './pages/NotFound'
import Chat from './pages/chat'
import './style/app/style.less'
import LinkHome from "./components/linkHome"
import ErrorBoundary from "./components/errorBoundary"

@withRouter
@observer
@inject('historyQ')
export default class App extends React.Component {
  constructor(props){
    super(props)
    this.state = {
      link: '/about'
    }
  }
  toggle(){
    let newLink = /chat/.test(location.href) ? '/about' : '/chat'
    this.setState({
      link: newLink
    })
  }
  componentWillReceiveProps(nextProps) {
    if (nextProps.location !== this.props.location) {
       console.log("nextProps.location",nextProps.location,"this.props.location",this.props.location)
       console.log("this.props.history",this.props.historyQ)
       this.props.historyQ.setFromUrl(this.props.location);
       console.log("前一个地址：", this.props.historyQ.fromUrl)
    }
  }
  render() {
    return (
      <div>
           <LinkHome/>
        {process.env.NODE_ENV === 'development' ? <DevTools /> : ''}
        <ErrorBoundary>
            <Switch>
              <Redirect exact strict from="/" to="/chat" />
              <Route exact  strict path="/chat" component={Chat} />
              {routes.map((route, i) => <Route  strict={true} key={i} {...route} />)}
              <Route component={NotFound} />
            </Switch>
          </ErrorBoundary>
      </div>
    )
  }
}
